<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8" />
    <title>JebGL test</title>
  <script type="text/javascript" src="../jebgl.js"></script>
  <script>
    var vSource = [
      "attribute vec3 pos;",
      "varying float time;",
      "void main(void) {",
      "time = pos.z;",
      "gl_Position = vec4(pos.x, pos.y, 0.0, 1.0);",
      "}"
      ].join("\n");

    var fSource = [
      "#ifdef GL_ES",
      "precision highp float;",
      "#endif",
      "varying float time;",
      "void main(void)",
      "{",
      "float co = cos(0.02*dot(gl_FragCoord,gl_FragCoord) + 2.0*3.14159265*time);",
      "if (co >= 0.0) {",
      "gl_FragColor = vec4(co, 0.0, 0.0, 1.0 );",
      "} else {",
      "gl_FragColor = vec4(0.0, 0.0, -co, 1.0);",
      "}",
      "}",
      ].join("\n");

    var gl,
        prog,
        buf,
        pa, 
        tu,
        time = 0,
        iter = 100;

    function initShaders() {
       prog = gl.createProgram();
       var vs = gl.createShader(gl.VERTEX_SHADER);
       var fs = gl.createShader(gl.FRAGMENT_SHADER);

       gl.shaderSource(vs, vSource);
       gl.shaderSource(fs, fSource);

       gl.compileShader(vs);
       gl.compileShader(fs);

       if (!gl.getShaderParameter(vs, gl.COMPILE_STATUS)) {
          var infoLog = gl.getShaderInfoLog(vs);
          gl.deleteProgram(prog);
          alert("VS ERROR: " + infoLog);
       }
       
       if (!gl.getShaderParameter(fs, gl.COMPILE_STATUS)) {
          var infoLog = gl.getShaderInfoLog(fs);
          gl.deleteProgram(prog);
          alert("FS ERROR: " + infoLog);
       }
       
       gl.attachShader(prog, vs);
       gl.attachShader(prog, fs);

       gl.deleteShader(vs);
       gl.deleteShader(fs);

       gl.linkProgram(prog);
       gl.useProgram(prog);
    }

    function initBuffer() {
       var vertices = [];
       for (var i=0; i<iter; i++) {
           vertices = vertices.concat([-1, -1, i/iter,
                                        1, -1, i/iter,
                                       -1,  1, i/iter,
                                        1, -1, i/iter,
                                        1,  1, i/iter,
                                       -1,  1, i/iter]);
       }

       buf = gl.createBuffer();
       gl.bindBuffer(gl.ARRAY_BUFFER, buf);
       gl.bufferData(gl.ARRAY_BUFFER, new Float32Array(vertices), gl.STATIC_DRAW);

       var indices = [];
       for (var i=0; i<iter; i++) {
           indices = indices.concat([ 0 + 6*i, 1 + 6*i, 2 + 6*i,
                                      3 + 6*i, 4 + 6*i, 5 + 6*i]);
       }

       ibuf = gl.createBuffer();
       gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, ibuf);
       gl.bufferData(gl.ELEMENT_ARRAY_BUFFER, new Uint16Array(indices), gl.STATIC_DRAW);
    }

    function draw() {
        gl.clear(gl.COLOR_BUFFER_BIT);
        gl.drawElements(gl.TRIANGLES, 6, gl.UNSIGNED_SHORT, Uint16Array.BYTES_PER_ELEMENT*6*(time % iter));
    }

    function tick() {
        draw()
        time+=1;
        setTimeout(tick, 1000/60);
    }

    function run() {
        var canvas = document.getElementById('canvas');
        gl = canvas.getContext("experimental-webgl");

        initShaders();
        initBuffer();
        
        gl.viewport(0, 0, canvas.width, canvas.height);
        gl.clearColor(0.0, 0.0, 0.0, 0.0);
        pa = gl.getAttribLocation(prog, "pos");
        gl.enableVertexAttribArray(pa);
        gl.bindBuffer(gl.ARRAY_BUFFER, buf);
        gl.vertexAttribPointer(pa, 3, gl.FLOAT, false, 0, 0);
        gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, ibuf);

        tick();
    }
 
    window.onload = function() {
      jebgl(document.getElementById('canvas'), run, {
         jebglJar: "../jebgl.jar",
         jarLocation: "../webstart/",
         development: true});
    };
  </script>
  </head>
  <body>
  <canvas id="canvas" width=512 height=512></canvas>
  </body>
</html>
